<!DOCTYPE HTML>
<html lang="zxx">

<head>
	<title>登录</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta charset="UTF-8" />
	<meta name="keywords" content=""/>
	<!-- Meta tag Keywords -->
	<!-- css files -->
	<link rel="stylesheet" href="/public/css/login.css" type="text/css" media="all" />
	<!-- Style-CSS -->
	<link rel="stylesheet" href="/public/css/fontawesome-all.css">
	<!-- Font-Awesome-Icons-CSS -->
	<!-- Jquery -->
	<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
	<script src="https://cdn.staticfile.org/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
	<script src="/js/hash.js"></script>
	<!-- //web-fonts -->
	<script>
		addEventListener("load", function () {
			setTimeout(hideURLbar, 0);
		}, false);

		function hideURLbar() {
			window.scrollTo(0, 1);
		}
		
		if ([[${isLogin}]]) {
			if ('[[${msg}]]' !== '') {
				alert('[[${msg}]]');
			}
		}
		else{
			$('#registBox').css('display','none');
			$('#loginBox').css('display','flex');
		}


		function checkInfo(){
			var passwordConfirm = $('#registBox').find("input[name=passwordConfirm]").val();
			var password = $('#registBox').find("input[name=password]").val();
			if (password == passwordConfirm){
				return true;
			}
			alert("两次密码不一致");
			return false;
		}


		function checkInfoWhenLogin(){
			var checked = $('#loginBox').find("input[name=autologin]").is(":checked");
			/*if (checked){
				$.cookie('account', $('#loginBox').find("input[name=account]").val(), { expires: 7 });
				$.cookie('password', $('#loginBox').find("input[name=password]").val(), { expires: 7 });
				$.cookie('autologin', checked, { expires: 7 });
			}
			else{
				$.cookie('account', '', { expires: 0 });
				$.cookie('password', '', { expires: 0 });
				$.cookie('autologin', '', { expires: 0 });
			}*/
			return true;
		}
	</script>
</head>

<body>
	<!-- bg effect -->
	<div id="bg">
		<canvas></canvas>
		<canvas></canvas>
		<canvas></canvas>
	</div>
	<!-- //bg effect -->
	<!-- title -->
	<h1>登录/注册</h1>
	<!-- //title -->
	<!-- content -->
	<div class="sub-main-w3" id="loginBox">
		<form action="/user/login" method="post" onsubmit="return checkInfoWhenLogin();">
			<!-- <h2>立即登录
				<i class="fas fa-level-down-alt"></i>
			</h2> -->
			<div class="form-style-agile">
				<label>
					<i class="fas fa-user"></i>
					用户名
				</label>
				<input placeholder="用户名" name="account" type="text" required="">
			</div>
			<div class="form-style-agile">
				<label>
					<i class="fas fa-unlock-alt"></i>
					密码
				</label>
				<input placeholder="密码" name="password" type="password" required="">
			</div>
			<!-- checkbox -->
			<div class="wthree-text">
				<ul>
					<li>
						<label class="anim">
							<input type="checkbox" name="autologin" class="checkbox">
							<span>自动登录</span>
						</label>
					</li>
					<li>
						<a href="javascript:alert('请联系管理员重置密码')">忘记密码</a>
					</li>
				</ul>
			</div>
			<input type="checkbox" name="autofull" style="display: none;">
			<!-- //checkbox -->
			<input type="submit" value="登录">
			<input type="button" value="注册" onclick="$('#loginBox').css('display','none');$('#registBox').css('display','flex');">
		</form>
	</div>


	<div class="sub-main-w3" id="registBox" style="display: none;">
		<form action="/user/register" method="post" onsubmit="return checkInfo();">
			<!-- <h2>立即登录
				<i class="fas fa-level-down-alt"></i>
			</h2> -->
			<div class="form-style-agile">
				<label>
					<i class="fas fa-user"></i>
					用户名
				</label>
				<input placeholder="用户名" name="account" type="text" required="">
			</div>
			<div class="form-style-agile">
				<label>
					<i class="fas fa-unlock-alt"></i>
					密码
				</label>
				<input placeholder="密码" name="password" type="password" required="">
			</div>
			<div class="form-style-agile">
				<label>
					<i class="fas fa-unlock-alt"></i>
					确认密码
				</label>
				<input placeholder="确认密码" name="passwordConfirm" type="password" required="">
			</div>
			<div class="form-style-agile">
				<label>
					<i class="fas address-card"></i>
					推荐码
				</label>
				<input placeholder="推荐码" name="activekey" type="text" required="">
			</div>
			<div class="wthree-text">
				<a href="javascript:$('#registBox').css('display','none');$('#loginBox').css('display','flex');">返回登录</a>
			</div>
			<input type="submit" onsubmit="checkInfo()" value="注册">
		</form>
	</div>
	<!-- //content -->

	<!-- copyright -->
	<!-- <div class="footer">
		<p>Copyright &copy; 2018.Company name All rights reserved.<a target="_blank" href="http://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p>
	</div> -->
	<!-- //copyright -->

	<!-- //Jquery -->

	<!-- effect js -->
	<script src="/public/js/canva_moving_effect.js"></script>
	<!-- //effect js -->

</body>
<script>
	$('#loginBox').find("input[name=password]").on("keydown", function() {
		console.log(1);
		console.log($('#loginBox').find("input[name=autofull]").is(":checked"));
		if ($('#loginBox').find("input[name=autofull]").is(":checked")) {
			$('#loginBox').find("input[name=autofull]").prop("checked", false);
			$('#loginBox').find("input[name=password]").val("");
		}
	});
	if ($.cookie('autologin')){
		$('#loginBox').find("input[name=account]").val($.cookie('account'));
		$('#loginBox').find("input[name=password]").val($.cookie('password'));
		$('#loginBox').find("input[name=autofull]").prop("checked", true);
		$('#loginBox').find("input[name=autologin]").prop('checked',$.cookie('autologin'));
	}
</script>
</html>